<!DOCTYPE html>
<html ng-app="appPanda">

    <head>

        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">

        <!-- Page title set in pageTitle directive -->
        <title >title</title>

        <!-- Bootstrap and Fonts -->
        <link href="public/css/bootstrap.min.css" rel="stylesheet">
        <link href="public/font-awesome/css/font-awesome.css" rel="stylesheet">
        <link href="public/js/kendo/styles/kendo.common.min.css" rel="stylesheet">
        <link href="public/js/kendo/styles/kendo.default.min.css" rel="stylesheet">
        

        <!-- Main Inspinia CSS files -->
        <link href="public/css/animate.css" rel="stylesheet">
        <link href="public/css/style.css" rel="stylesheet">
        <!-- Plugins --->
        <link href="public/plugins/tree-control/css/tree-control.css" rel="stylesheet">
        <link href="public/plugins/tree-control/css/tree-control-attribute.css" rel="stylesheet">
        

    </head>

    <!-- ControllerAs syntax -->
    <!-- Main controller with serveral data used in Inspinia theme on diferent view -->
    <body ng-controller="MainCtrl">
		
        <!-- Wrapper-->
        <div id="header-app">
			<div class="container">
				<h1><i class="fa fa-bars controll-menu visible-xs-inline-block"></i>  Dk-app</h1>
			</div>
		</div>
		<div id="container-menu-dk" ng-show="isAuthentication">
			<div class="container">
				<ul id="menu-dk">
					<li role="presentation" class="dropdown">
						<a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
						  <i class="fa fa-gg-circle"></i> Hàng hóa <span class="caret"></span>
						</a>
						<ul class="dropdown-menu">
						  <li><a href="#/products">Danh mục sản phẩm</a></li>
						  <li><a href="#">Kiểm kho</a></li>
						</ul>
					 </li>
					 <li role="presentation" class="dropdown">
						<a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
						  <i class="fa fa-refresh"></i> Giao dịch <span class="caret"></span>
						</a>
						<ul class="dropdown-menu">
						  <li><a href="#">Nhập hàng</a></li>
						  <li><a href="#">Trả hàng nhập</a></li>
						</ul>
					 </li>
					 <li role="presentation" class="dropdown">
						<a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
						  <i class="fa fa-group"></i> Đối tác <span class="caret"></span>
						</a>
						<ul class="dropdown-menu">
						  <li><a href="#">Khách hàng</a></li>
						  <li><a href="#">Đối tác</a></li>
						</ul>
					 </li>
					 <li role="presentation" class="dropdown">
						<a class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
						  <i class="fa fa-file-pdf-o"></i> Báo cáo <span class="caret"></span>
						</a>
						<ul class="dropdown-menu">
						  <li><a href="#">Khách hàng</a></li>
						  <li><a href="#">Đối tác</a></li>
						</ul>
					 </li>
					 <li class="last-menu"></li>
				</ul>
			</div>
        </div>
		
		
        
        <div class="container" style="padding-top: 20px">
            <div  ng-view ></div>
        </div>
        
        <!-- End wrapper-->
        <!-- jQuery and Bootstrap -->
        <script src="public/js/kendo/js/jquery.min.js"></script>
        <script src="public/js/kendo/js/angular.min.js"></script>
        <script src="public/js/bootstrap/bootstrap.min.js"></script>
        <script src="public/js/kendo/js/kendo.core.min.js"></script>
        <script src="public/js/kendo/js/kendo.angular.min.js"></script>
        <script src="public/js/kendo/js/kendo.ui.core.min.js"></script>
        <!--<script src="public/js/kendo/js/kendo.notification.min.js"></script>-->
        
        <!-- Plugins --->
        <script src="public/plugins/tree-control/angular-tree-control.js"></script>
        <script src="public/js/bootstrap/ui-bootstrap-tpls-0.11.0.min.js"></script>
		<script src="public/plugins/wysiwyg/bootstrap-colorpicker-module.js"></script>
		<script src="public/plugins/wysiwyg/angular-wysiwyg.js"></script>
        <!-- angular module-->
        <script src="public/js/angular/angular-route.min.js"></script>
        <script src="public/js/ngStorage/ngStorage.min.js"></script>
        <script src="public/js/app.js"></script>
        
        <!-- service --->
        <script src="services/user.js"></script>
        <script src="services/api.js"></script>
        <script src="services/category.js"></script>
        <script src="services/product.js"></script>
        <!--    -->
        <script src="directives/detailProduct.js"></script>
        <!--  widgets -->
        <script src="services/widgets/modalAddCategory.js"></script>
        <script src="services/widgets/dialogMessage.js"></script>
        <script src="controllers/widgets/modalAddCategory.js"></script>
        <script src="controllers/widgets/dialogMessage.js"></script>
        <!-- controller -->
        <script src="controllers/homeCtrl.js"></script>
        <script src="controllers/loginCtrl.js"></script>
        <script src="controllers/productsCtrl.js"></script>
        <script src="controllers/addProductCtrl.js"></script>
        
        
		
		
		<!--/*----------- new menu    -------*/-->
		<script>
			$(document).ready(function(){
				$('.controll-menu').on('click',function(){
					if($('#container-menu-dk').hasClass('active-menu')){
						$('#container-menu-dk').removeClass('active-menu');
						$('#container-menu-dk').animate({left: -250});
					}else{
						$('#container-menu-dk').addClass('active-menu');
						$('#container-menu-dk').animate({left: 0});
					}
				});
			});
		</script>

    </body>
</html>
